import { request } from "../../request/index.js";
Page({

    /**
     * 页面的初始数据
     */
    data: {
        // 大菜单数据
        leftMenuList: [],
        // 具体分类数据
        rightContent: [],
        // 被点击的左侧菜单
        currentIndex: 0,
        // 右侧滚动条距离顶部的距离
        scrollTop: 0
    },
    // 接口的返回数据
    Cates: [],
    // 左侧菜单点击事件
    handleItemTap(e) {
        // console.log(e);
        const { index } = e.currentTarget.dataset
        let rightContent = this.Cates[index].children;
        this.setData({
            currentIndex: index,
            rightContent,
            scrollTop: 0
        })
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function(options) {
        /* 优化缓存
          0 微信和web中本地存储的区别
              1 写的方式不一样
                web：localStorage.setItem("key","value"),localStorage.getItem("key") 
                小程序：getStorageSync("key","value");setStorageSync("key");
               2 存储的时候没有类型转换
                web：不管存入什么数据都会先进行 toString()
                小程序中：存入什么数据就是什么类型数据
          1 先判断本地存储中有没有就数据
           存储数据格式 {time:Date.now(),data:[....]}
          2 没有就数据直接发送请求
          3 有旧的数据 同时 旧的数据也没有过期 就使用本地存储中的旧数据即可
        */
        //  1 获取本地存储中的数据（小程序中也存在本地存储 技术）
        // getStorageSync 从本地存储中同步获取数据

        const Cates = wx.getStorageSync("cates");
        // 2 判断
        if (!Cates) {
            // console.log("不存在数据发送请求");
            // 不存在 发送请求数据
            this.getCates();
        } else {
            // 有旧数据
            //  判断数据是否过期
            if (Date.now() - Cates.time > 1000 * 10) {
                // console.log("旧数据不能使用");
                this.getCates();
            } else {
                // console.log("可以使用旧数据");
                this.Cates = Cates.data;
                let leftMenuList = this.Cates.map(v => v.cat_name);
                let rightContent = this.Cates[0].children;
                this.setData({
                    leftMenuList,
                    rightContent
                })
            }

        }
    },
    // 获取分类数据
    async getCates() {
        // request({
        //     url: "/categories"
        // }).then(res => {
        //     // console.log(res);
        //     this.Cates = res.data.message;
        //     // 把接口数据存储在本地中
        //     wx.setStorageSync("cates", { time: Date.now(), data: this.Cates })
        //         // 构造大菜单数据
        //     let leftMenuList = this.Cates.map(v => v.cat_name);
        //     let rightContent = this.Cates[0].children;
        //     this.setData({
        //         leftMenuList,
        //         rightContent
        //     })
        // })
        const res = await request({ url: '/categories' });
        this.Cates = res.data.message;
        wx.setStorageSync('cates', { time: Date.now(), data: this.Cates })
        let leftMenuList = this.Cates.map(v => v.cat_name);
        let rightContent = this.Cates[0].children;
        this.setData({
            leftMenuList,
            rightContent
        })
    }
})